<form accept-charset="utf-8" method="post" enctype="multipart/form-data">
    <aside class="right-side">
        <!-- BEGIN: Content Header (Page header) -->
        <section class="content-header no-margin">
            <h1 class="text-center">
                Hộp thư            </h1>
        </section>
        <!-- END: Content Header (Page header) -->

        <!-- BEGIN: Main content -->
        <section class="content">
            <!-- MAILBOX BEGIN -->
            <div class="mailbox row">
                <div class="col-xs-12">
                    <div class="box box-solid">
                        <div class="box-body">
                            <div class="row">
                                <div class="col-md-3 col-sm-4">
                                    <!-- BOXES are complex enough to move the .box-header around.
                                         This is an example of having the box header within the box body -->
                                    <div class="box-header">
                                        <i class="fa fa-inbox"></i>
                                        <h3 class="box-title">Hộp thư đến</h3>
                                    </div>
                                    <!-- compose message btn -->
                                    <a class="btn btn-block btn-primary" data-toggle="modal" data-target="#compose-modal"><i class="fa fa-pencil"></i> Soạn thư</a>
                                    <!-- Navigation - folders-->
                                    <div style="margin-top: 15px;">
                                        <ul class="nav nav-pills nav-stacked">
                                            <li class="header">Thư mục</li>
                                            <li class="active"><a href="http://demo011.ioi.vn/vn/tsmedia/mailto/index/" title="0 mail chưa đọc"><i class="fa fa-inbox"></i> Hộp thư đến (0)</a></li>
                                            <!--<li><a href="#"><i class="fa fa-comments-o"></i> Hỏi đáp (5)</a></li>-->
                                            <li><a href="http://demo011.ioi.vn/vn/tsmedia/mailto/customer/" title="0 mail chưa đọc"><i class="fa fa-inbox"></i> Đăng ký nhận mail</a></li>
                                            <li><a href="http://demo011.ioi.vn/vn/tsmedia/mailto/trash/" title="0 mail chưa đọc"><i class="fa fa-trash-o"></i> Thùng rác (0)</a></li>
                                            <!--<li><a href="#"><i class="fa fa-pencil-square-o"></i> Drafts</a></li>-->
                                            <!--<li><a href="http://demo011.ioi.vn/vn/tsmedia/mailto/send/"><i class="fa fa-mail-forward"></i> Sent</a></li>-->
                                            <!--<li><a href="#"><i class="fa fa-star"></i> Starred</a></li>
                                            <li><a href="#"><i class="fa fa-folder"></i> Junk</a></li>-->
                                        </ul>
                                    </div>
                                </div><!-- /.col (LEFT) -->
                                <div class="col-md-9 col-sm-8">
                                    <div class="row pad">
                                        <div class="col-sm-6">
                                            <label>
                                                <input type="checkbox" id="check-all">
                                            </label>
                                            <!-- Action button -->
                                            <div class="btn-group">
                                                <button type="button" class="btn btn-default btn-sm btn-flat dropdown-toggle" data-toggle="dropdown">
                                                    Hành động <span class="caret"></span>
                                                </button>
                                                <ul class="dropdown-menu" role="menu">
                                                    <li>
                                                        <button name="deleteCheckAll" class="btn-dropdown"><i class="fa fa-trash-o"></i> Bỏ vào thùng rác</button>
                                                    </li>
                                                </ul>
                                            </div>

                                        </div>

                                        <div class="col-sm-6 search-form">
                                            <form action="#" class="text-right">
                                                <div class="input-group">
                                                    <input type="text" class="form-control input-sm" name="fkeyword" placeholder="Tìm kiếm">
                                                    <div class="input-group-btn">
                                                        <button type="submit" name="fsearchtour" class="btn btn-sm btn-primary"><i class="fa fa-search"></i></button>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div><!-- /.row -->

                                    <div class="table-responsive">
                                        <!-- THE MESSAGES -->
                                        <table class="table table-mailbox table-checkbox">
                                            <tbody>
                                            <!--<tr class="unread">
                                                <th><input type="checkbox" id="check-all"></th>
                                                <th>Người gửi</th>
                                                <th>Nội dung</th>
                                                <th>Ngày gửi</th>
                                            </tr>-->
                                            </tbody></table>
                                    </div><!-- /.table-responsive -->
                                </div><!-- /.col (RIGHT) -->
                            </div><!-- /.row -->
                        </div><!-- /.box-body -->

                        <!-- BEGIN: Box-Footer -->
                        <div class="box-footer clearfix">
                            <ul class="pagination pagination-sm no-margin pull-right">
                                <li class="disabled"><a>Tất cả: 0 email</a></li>
                            </ul>
                        </div>
                        <!-- END: Box-Footer -->
                    </div><!-- /.box -->
                </div><!-- /.col (MAIN) -->
            </div>
            <!-- MAILBOX END -->
        </section>
        <!-- END: Main content -->
    </aside>
</form>
<!--begin soan mail-->
<div class="modal fade in" id="compose-modal" tabindex="-1" role="dialog" aria-hidden="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title"><i class="fa fa-envelope-o"></i> Compose New Message</h4>
            </div>
            <form action="#" method="post">
                <div class="modal-body">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">TO:</span>
                            <input name="email_to" id="email_to" required="required" type="email" class="form-control" placeholder="Email TO">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">CC:</span>
                            <input name="email_cc" id="email_cc" type="email" class="form-control" placeholder="Email CC">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">BCC:</span>
                            <input name="email_bcc" id="email_bcc" type="email" class="form-control" placeholder="Email BCC">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon">Title:</span>
                            <input name="email_title" id="email_title" required="required" type="text" class="form-control" placeholder="Title">
                        </div>
                    </div>
                    <div class="form-group">
                        <textarea name="email_message" required="required" id="email_message" class="form-control textarea" placeholder="Message" style="height: 120px;"></textarea>
                    </div>
                    <!--<div class="form-group">
                        <div class="btn btn-success btn-file">
                            <i class="fa fa-paperclip"></i> Attachment
                            <input type="file" name="attachment">
                        </div>
                        <p class="help-block">Max. 32MB</p>
                    </div>-->

                </div>
                <div class="modal-footer clearfix">
                    <button type="button" class="btn btn-danger" data-dismiss="modal"><i class="fa fa-times"></i> Discard</button>
                    <button type="submit" id="sf_sendmail" class="btn btn-primary pull-left"><i class="fa fa-envelope"></i> Send Message <img src="http://demo011.ioi.vn/public/backend/images/loading3.gif" class="img_load" style="display: none" alt="Loading..." /></button>
                </div>
            </form>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>